<template>
  <!-- 书写html结构 只可以有一个div 但是可以嵌套多个div -->
  <div>
    <van-sticky>
      <!-- 导航栏 -->
      <van-nav-bar
        title="选择门店"
        left-text=""
        left-arrow
        @click-left="returnTo"></van-nav-bar>
      <van-row style="margin-top: 9px">
        <van-col span="21">
          <van-search
            v-model="value"
            shape="round"
            placeholder="请输入搜索关键词" />
        </van-col>
        <van-col
          span="3"
          style="margin-top: 15px; text-align: left; font-size: 24px"
          ><van-icon name="search"
        /></van-col>
      </van-row>
      <!-- 标题 -->
    </van-sticky>
    <div v-for="item in list" style="margin-left: 15px">
      <van-radio-group v-model="storeIdA" v-for="val in item.ridio">
        <van-radio
          style="margin-top: 18px; margin-bottom: 18px"
          :name="val.storeId"
          @click="assignment(val.storeName)"
          >{{ val.storeName }}</van-radio
        >
        <div style="background: #f6f6f6; height: 1px"></div>
      </van-radio-group>
    </div>
    <div style="height: 333px"></div>
    <div style="width: 360px">
      <van-goods-action-button
        color="#019FE8"
        type="danger"
        style="margin-bottom: 0px"
        @click="confirm"
        text="确定" />
      <div style="height: 15px"></div>
    </div>
  </div>
</template>
<!--书写组件配置项目  相当于写js代码的地方 -->
<script>
//数据 全是json格式
export default {
  //注册属性 父传子 数据传递
  props: {},
  data() {
    //定义数据
    return {
      storeIdA: "",
      storeIdb: "",
      list: [
        {
          val: [],
          id: 2,
          ridio: [],
        },
      ],
      radio: "",
    };
  },
  //初始化数据
  created() {
    this.loadData();
  },
  //方法书写
  methods: {
    assignment(na) {
      this.storeIdb = na;
    },
    confirm() {
      this.$router.push({
        name: "Selectlicenseplate",
        query: {
          id: this.$route.query.id,
          smala: this.$route.query.smala,
          pho: this.$route.query.pho,
          storeId: this.storeIdA,
          storeName: this.storeIdb,
        },
      });
    },
    returnTo() {
      this.$router.go(-1);
    },
    loadData() {
      //不是直接使用axios 而是使用$http
      //baseURL="http://localhost:8080"
      var _this = this;
      this.$http
        .get("/tbStore/queryUserStore?id=" + this.$route.query.id)
        .then(function (response) {
          console.log(response);
          if (response.data.code == 200) {
            //this不可以直接使用 代表的是axios对象
            // alert(JSON.stringify(response.data.data))
            _this.list[0].ridio = response.data.data;
            // alert(JSON.stringify(_this.list[0].ridio));
          }
        })
        .catch(function (error) {
          console.log(error);
        });
    },
  },
  //声明注解
  components: {},
};
</script>
